<template>
  <div>
    <el-dialog
      title="月度电量电费信息"
      :visible.sync="dialogVisible"
      width="55%"
      @close="quxiao">
      <div>
        <el-form ref="form" :model="formdata" label-width="100px" label-position="left">
            <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="用电企业">
                      <el-select v-model="formdata.companyId" placeholder="请选择" size="small" style="width: 100%;">
                        <el-option
                          v-for="item in xitonglist"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id">
                        </el-option>
                      </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="年度">
                    <el-date-picker style="width: 100%;" v-model="formdata.year" type="year" value-format="yyyy" placeholder="选择年" size="small"></el-date-picker>
                  </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="月份">
                      <el-select v-model="formdata.month" placeholder="请选择" size="small" style="width: 100%;">
                        <el-option label="一月" value="1"></el-option>
                        <el-option label="二月" value="2"></el-option>
                        <el-option label="三月" value="3"></el-option>
                        <el-option label="四月" value="4"></el-option>
                        <el-option label="五月" value="5"></el-option>
                        <el-option label="六月" value="6"></el-option>
                        <el-option label="七月" value="7"></el-option>
                        <el-option label="八月" value="8"></el-option>
                        <el-option label="九月" value="9"></el-option>
                        <el-option label="十月" value="10"></el-option>
                        <el-option label="十一月" value="11"></el-option>
                        <el-option label="十二月" value="12"></el-option>
                      </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="期">
                    <el-radio-group v-model="formdata.period">
                      <el-radio v-for="item in qilist" :key="item.value" :label="item.value">{{item.text}}</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="预算电量">
                     <el-input
                        placeholder="请输入预算电量"
                        size="small"
                        v-model="formdata.budgetPower">
                        <span slot="suffix" >kWh</span>
                      </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="未税预算电费">
                     <el-input
                        placeholder="请输入未税预算电费"
                        size="small"
                        v-model="formdata.withoutTaxBudgetCost">
                        <span slot="suffix" >元</span>
                      </el-input>
                  </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="实际电量">
                     <el-input
                        placeholder="请输入实际电量"
                        size="small"
                        v-model="formdata.actualPower">
                        <span slot="suffix" >kWh</span>
                      </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="未税实际电费">
                     <el-input
                        placeholder="请输入未税实际电费"
                        size="small"
                        v-model="formdata.withoutTaxActualCost">
                        <span slot="suffix" >元</span>
                      </el-input>
                  </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="12">
                  <el-form-item label="实际税费">
                     <el-input
                        placeholder="请输入实际税费"
                        size="small"
                        v-model="formdata.actualTax">
                        <span slot="suffix" >元</span>
                      </el-input>
                  </el-form-item>
                </el-col>
            </el-row>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="quxiao" size="small">取 消</el-button>
        <el-button type="primary" @click="submit" size="small">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {postBudgetListapi,putBudgetListapi} from '@/api/energy-consumption/demand/annual-budget'
import { getzidianxialaapi } from '@/api/guidelines'
export default {
  name: 'CallPoliceDialodAdd',
  props:{
    xitonglist:{
      type:Array,
      default:()=>[]
    }
  },
  data() {
    return {
      formdata:{},
      qilist:[],
      dialogVisible:false,
      isupdate:false
    };
  },

  async mounted() {
    const {data:{list}} = await getzidianxialaapi({ dictType: 'EcmAnnualBudgetPeriod' })
    this.qilist=list
  },

  methods: {
    async submit(){
      this.isupdate?await putBudgetListapi(this.formdata).then(res=>{
        this.$message({
          type:res.code==200?'success':'warning',
          message:res.code==200?'修改成功':res.message
        })
        this.quxiao()
        this.$emit('getlist')
      }):await postBudgetListapi(this.formdata).then(res=>{
        this.$message({
          type:res.code==200?'success':'warning',
          message:res.code==200?'新增成功':res.message
        })
        this.quxiao()
        this.$emit('getlist')
      })
    },
    putrow(row){
      this.isupdate=true
      this.formdata={...row}
      this.dialogVisible=true
    },
    quxiao(){
      this.formdata={}
      this.isupdate=false
      this.dialogVisible=false
    }
  },
};
</script>
<style lang="scss" scoped>
::v-deep .el-dialog__footer{
  text-align: center;
}
</style>